///
///  photo_view_demo.dart
///  create by zmtzawqlp on 2019/4/4
import 'package:custom_widgets/flat_map.dart';
import 'package:flutter/material.dart' hide CircularProgressIndicator;

import '../hero_image/hero_image_hint_widget.dart';
import '../hero_image/hero_swiper_image_widget.dart';

class PageViewDemo extends StatefulWidget {
  @override
  _PageViewDemoState createState() => _PageViewDemoState();
}

class _PageViewDemoState extends State<PageViewDemo> {
  List<String> images1 = <String>[
    'https://photo.tuchong.com/14649482/f/601672690.jpg',
    'https://photo.tuchong.com/17325605/f/641585173.jpg',
    'https://photo.tuchong.com/3541468/f/256561232.jpg',
    'https://photo.tuchong.com/16709139/f/278778447.jpg',
    'https://photo.tuchong.com/15195571/f/233361383.jpg',
    'https://photo.tuchong.com/5040418/f/43305517.jpg',
    // 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1606479505143&di=83a2988c1a8a2c81427c052db24cec50&imgtype=0&src=http%3A%2F%2Fwx1.sinaimg.cn%2Fmw690%2Fa716fd45ly1gfkifr84h8j20rs3d77m3.jpg',
    'https://photo.tuchong.com/3019649/f/302699092.jpg',
  ];

  final PageController pageController = PageController(initialPage: 0);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('SlidePage'),
      ),
      body: _body(),
    );
  }

  int currentPage = 0;

  Widget _body() {
    images1.asMap().compactMap<Widget>((p0) {
      return HeroSwiperImageWidget(
        images1,
        index: p0.key,
        onPageChanged: (index) {},
      );
    });

    return Column(
      children: [
        Container(
          height: 400,
          child: PageView(
            controller: pageController,
            onPageChanged: _onPageChanged,
            children: images1.asMap().compactMap<Widget>((p0) {
              return ImageHintWidget(
                HeroSwiperImageWidget(
                  images1,
                  index: p0.key,
                  onPageChanged: _onPageChanged,
                  fit: BoxFit.cover,
                ),
              );
            }).toList(),
          ),
        ),
        Container(
          height: 50,
          alignment: Alignment.center,
          child: Text(
            '$currentPage/${images1.length}',
            style: Theme.of(context).textTheme.titleMedium!.copyWith(
                  fontSize: 20,
                  fontWeight: FontWeight.bold,
                ),
          ),
        )
      ],
    );
  }

  void _onPageChanged(int index) {
    setState(() {
      currentPage = index;
    });
    pageController.jumpToPage(index);
  }
}
